﻿@*
    For more information on enabling MVC for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860
*@
@{
}


<link href="~/lib/layui/css/layui.css" rel="stylesheet" />
<script src="~/lib/layui/layui.js"></script>
<script src="~/lib/jquery/dist/jquery.js"></script>


<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>用户管理</title>
    <!-- 请勿在项目正式环境中引用该 layui.css 地址 -->
    <link href="//unpkg.com/layui@2.9.18/dist/css/layui.css" rel="stylesheet">

    <title>Demo</title>

</head>
<body>
    <style>
        .demo-login-container {
            display: flex;
            flex-wrap: wrap; /* 允许换行 */
        }

        .layui-form-item.layui-inline {
            width: 48%; /* 设置每个表单项的宽度 */
            margin-right: 4%; /* 添加间距 */
            box-sizing: border-box; /* 确保内边距和边框包含在宽度内 */
        }

            .layui-form-item.layui-inline:nth-child(2n) {
                margin-right: 0; /* 去除每行第二个元素的右边距 */
            }

        .layui-form-label {
            width: 90px; /* 根据需要调整标签宽度 */
        }

        .layui-input-block, .layui-input-inline {
            margin-left: 70px; /* 确保输入框与标签对齐 */
        }

        .layui-form-select {
            width: 189px;
        }
    </style>
    <script src="//unpkg.com/layui@2.9.21-rc/dist/layui.js"></script>
    <script src="//unpkg.com/layui@2.9.18/dist/layui.js"></script>
    <script src="//unpkg.com/jquery/dist/jquery.js"></script>
    <form class="layui-form" id="materialAddForm">
        <div>

           @*  <div class="layui-form-item">
               
                <div class="layui-input-block">
                    <i lay-on="test-page-custom" class="layui-icon layui-icon-search" style="font-size: 20px;"  >高级查询</i>
                </div>
            </div> *@

            <div class="layui-form-item">
                <div class="layui-input-block">
                    <label class="layui-form-label">产品:</label>
                    <select name="getProducts" id="getProducts" lay-filter="aihao" style="width: 400px">
                    </select>
                </div>
            </div>


            <div class="layui-form-item">
                <label class="layui-form-label">产品名称:</label>
                <div class="layui-input-block">
                    <input type="text" id="productName" required lay-verify="required" placeholder="产品名称" disabled class="layui-input">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">产品编码</label>
                <div class="layui-input-block">
                    <input type="text" id="productNumber" required lay-verify="required" placeholder="产品编码" disabled class="layui-input">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">产品规格</label>
                <div class="layui-input-block">
                    <input type="text" id="productSpecification" required lay-verify="required" placeholder="产品规格" disabled class="layui-input">
                </div>
            </div>
           
            
            <div class="layui-form-item">
                <label class="layui-form-label">单位</label>
                <div class="layui-input-inline">
                    <input type="text" id="stockUnit" required lay-verify="required" placeholder="单位" disabled class="layui-input">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">单位用量</label>
                <div class="layui-input-block">
                    <input type="text" id="unitMach" required lay-verify="required"  autocomplete="off" class="layui-input">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">父分类</label>
                <div class="layui-input-inline">
                        <select id="parentId" lay-filter="testSelect2" required>
                        </select>



                        @* <div id="ID-tree-demo-onlyIconControl"></div> *@

                </div>
                    <div id="test1" class="demo-tree-more"></div>
            </div>


            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button  onclick="addMaterial()" >添加</button>
                    <button type="reset" class="layui-btn layui-btn-primary" lay-filter="resetForm" >重置</button>
                </div>
            </div>
        </div>
    </form>

    <script>


        var layer = layui.layer;
        var form = layui.form;
        var $ = layui.jquery;
        var treeTable=layui.treeTable;
        var util = layui.util;
        var pageIndex = 1;
        var pageSize = 20;

        //高级查询
        layui.use(['layer', 'form'], function () {

            // 事件
            util.on('lay-on', {
                'test-page-custom': function () {
                    layer.open({
                        type: 2,
                        area: ['1350px', '700px'],
                        shadeClose: true,
                        title: '产品查询',
                        content: '/Materials/MaterialsProductsView',

                    });
                }
            });

        });


        $(function () {
            // 产品下拉框
            getProducts();
            getParentId();
        })
        //获取产品信息
        function getProducts() {
            $.get({
                url: '@ViewBag.GlennQuigmrire' + "/api/Products/GetSearchProducts?PageIndex=" + pageIndex + "&PageSize=" + pageSize,
                data: JSON.stringify({}),
                async: false,
                dataType: "json",
                contentType: "application/json",
                success: res => {
                    console.log(res);
                    //var content = "";
                    $("#getProducts").append(` <option value="0">请选择产品</option>`);
                    $.each(res.data, function () {
                        $("#getProducts").append(`<option value="${this.productId}">${this.productName}</option>`);
                        //content += `<option value="${this.productId}">${this.productName}</option>`;
                    })
                    //$("#getProducts").html(content);
                    form.render('select');
                }
            })
        }

        //获取父分类
        function getParentId() {
            $.get({
                url: '@ViewBag.GlennQuigmrire' + "/api/Materials/MaterialParentIdSearch",
                data: JSON.stringify({}),
                async: false,
                dataType: "json",
                contentType: "application/json",
                success: res => {
                    console.log(res);
                    var content = "";
                    $("#parentId").append(` <option value="0">请选择父分类(分类的父级)</option>`);
                    $.each(res.data, function () {
                        $("#parentId").append(`<option value="${this.materialId}">${this.productName}(${this.parentName}) </option > `);
                        //content += `<option value="${this.id}">${this.name}</option>`;
                    })
                    //$("#parentId").html(content);
                    form.render('select');
                }
            })
        }

        

        //表单重置
        form.on('resetForm', function (data) {
            console.log(data);
            //重置表单
            form.render();
            //清空表单数据
            $("#getProducts").val(0);
            $("#productName").val("");
            $("#productNumber").val("");
            $("#productSpecification").val("");
            $("#stockUnit").val("");
            $("#unitMach").val("");
            $("#parentId").val(0);
            //页面表单渲染
            form.render();
        });

    </script>

    <script>


        var layer = layui.layer;
        var form = layui.form;
        var $ = layui.jquery;
        var treeTable = layui.treeTable;
        var util = layui.util;
        var pageIndex = 1;
        var pageSize = 20;

        //产品下拉框改变事件
        form.on('select(aihao)', function (data) {
            console.log(data.value);
            change();
        });

        //获取产品信息
        function change() {
            var productId = $("#getProducts").val();
            if (productId == 0) {
                return;
            }
            $.post({
                url: '@ViewBag.GlennQuigmrire' + "/api/Materials/ProductDetail",
                data: JSON.stringify({ productId: productId }),
                async: false,
                dataType: "json",
                contentType: "application/json",
                success: res => {
                    console.log(res);
                   
                        var data = res.data;
                        $("#productName").val(data.productName);
                        $("#productNumber").val(data.productNumber);
                        $("#productSpecification").val(data.productSpecification);
                         $("#stockUnit").val(data.stockUnit == 1 ? "条" : data.stockUnit == 2 ? "张" : data.stockUnit == 3 ? "车" : data.stockUnit == 4 ? "车" : data.stockUnit == 5 ? "天" : data.stockUnit == 6 ? "小时" : data.stockUnit == 7 ? "分钟" : data.stockUnit == 8 ? "周" : data.stockUnit ? "月" : "");
                        //页面表单渲染
                        form.render();
                }
            })
        }

       

        //添加物料
        function addMaterial() {
            var productId = $("#getProducts").val();

            var unitMach = $("#unitMach").val();
            var parentId = $("#parentId").val();
            var createId = 1;
            var createName = "雷鑫";
            if (productId == 0) {
                layer.msg("请选择产品");
                return;
            }

            if (unitMach == "") {
                layer.msg("请填写单位用量");
                return;
            }
            if (parentId == 0) {
                alert("未选择父类，即将添加一条父级物料");
            }
            $.post({
                url: '@ViewBag.GlennQuigmrire' + "/api/Materials/MaterilCreate",
                data: JSON.stringify({
                    productId: productId,
                    unitMach: unitMach,
                    parentId: parentId,
                    createId: createId,
                    createName: createName
                }),
                async: false,
                dataType: "json",
                contentType: "application/json",
                success: res => {
                    console.log(res);
                    alert("添加成功");
                    //关闭当前弹出层并刷新父页面
                    var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                    parent.layer.close(index); //再执行关闭
                    parent.location.reload(); //刷新父页面
                   
                }
            })
        }


    </script>

</body>
</html>








